<?php 
$page_title="Family Members";
require_once('../auth/auth.php');
include('templates/header.php'); 
?>

<div class="row-fluid sortable">		
	<div class="box span12">
		<div class="box-header well" data-original-title>
			<h2><i class="icon-user"></i> Family Members</h2>
				<div class="box-icon">
					<a href="#" class="btn btn-setting btn-round"><i class="icon-cog"></i></a>
					<a href="#" class="btn btn-minimize btn-round"><i class="icon-chevron-up"></i></a>
				</div>
		</div>
						
	    <div class="box-content">
			<a id="btnAddNewRow" class="btn btn-success" data-toggle="modal" href="#userNewModal"><i class="icon-user icon-white"></i> New</a>      						
			<a id="btnDeleteRow" class="btn btn-danger" href="#"><i class="icon-trash icon-white"></i> Delete</a>      
			
			<br/ ><br/ >
			<table class="table table-striped table-bordered bootstrap-datatable datatable">
					<thead>
						<tr>
							<th>First Name</th>
							<th>Last Name</th>								  
							<th>Gender</th>
							<th>Age</th>
							<th>Date Of Birth</th>						  
							<th>Relationship</th>
							<th>Action</th>
						</tr>
					</thead>   
					<tbody>
						<?php 
							include 'db/MemberTable.php';
						?>      
                    </tbody> 
            </table>
        </div>
	</div><!--/span-->
</div><!--/row-->
			

<!-- Add new family member after clicking "New" button-->
<form id="formAddNewRow" action="db/AddMember.php" title="Add New Family Member">
	<!-- First Name-->
    <div class="control-group">
     <label class="control-label" for="first_name">First Name</label>
      <div class="controls">
        <input type="text" class="input-xlarge" name="first_name" id="first_name" rel="0">
      </div>
    </div>
    <!-- Last Name-->
	<div class="control-group">
      <label class="control-label" for="last_name">Last Name</label>
      <div class="controls">
        <input type="text" class="input-xlarge" name="last_name" id="last_name" rel="1">
      </div>
    </div>
	<!-- Gender-->				
	<div class="control-group">
		<label class="control-label" for="gender">Gender</label>
		<div class="controls">
		  <label class="radio">
			<input name="gender" type="radio" id="genderradio1" value="male" rel="2">
				Male
		  </label>
		  <div style="clear:both"></div>
		  <label class="radio">
			<input type="radio" name="gender" id="genderradio2" value="female" rel="2">
				Female
		  </label>
		</div>
	 </div>
	<!-- Age-->
	<div class="control-group">
		<label class="control-label" for="age">Age</label>
		<div class="controls">
			<input name="age" class="input-xlarge focused" id="age" type="text" rel="3">
		</div>
	</div>
	<!-- Date of Birth-->
	<div class="control-group">
		<label class="control-label" for="date_of_birth">Date of Birth</label>
		<div class="controls">
			<input name="date_of_birth" type="text" class="input-xlarge datepicker" id="date_of_birth" rel="4">
		</div>
	</div>
	<!-- Relationship-->
	<div class="control-group">
		<label class="control-label" for="relationship">Relationship</label>
		<div class="controls">
			<input name="relationship" class="input-xlarge focused" id="relationship" type="text" rel="5">
		</div>
	</div>
	<!-- Action button-->
	<div class="control-group">
      <div class="controls">
        <input type="hidden" value='<a class="btn btn-info table-action-EditUser"><i class="icon-edit icon-white"></i>Edit</a>' rel="6">
      </div>
    </div>	

   	
	<!-- the "Add" button at bottom right corner-->
	<div style="text-align: right">
		<button id="btnAddNewRowOK" class="btn btn-primary" type="submit">Add</button>
	</div>
</form>			

	
		<!-- EXAMPLE POP UP FOR SETTINGS-->
<div class="modal hide fade" id="dataConfirmModal">
		<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">×</button>
				<h3>New User</h3>
			</div>
			<div class="modal-body">
				<p>Test...</p>
			</div>
			<div class="modal-footer">
				<a href="#" class="btn" data-dismiss="modal">Close</a>
				<a href="#" class="btn btn-primary">Save changes</a>
			</div>
</div>

<?php include('templates/footer.php'); ?>